<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Media Player</title>
    <script src="https://cdn.jsdelivr.net/npm/flv.js/dist/flv.min.js"></script>
</head>
<body>
<video id="videoPlayer" controls autoplay></video>
<script>
    window.onload = function() {
        const videoPlayer = document.getElementById('videoPlayer');
        const streamUrl = 'http://192.168.8.176:1985/rtc/v1/whep/?app=live&stream=livestream';
        if (flvjs.isSupported()) {
            try {
                const flvPlayer = flvjs.createPlayer({
                    type: 'flv',
                    url: streamUrl
                });
                flvPlayer.attachMediaElement(videoPlayer);
                flvPlayer.load();
                flvPlayer.play();
            } catch (error) {
                console.error('Error initializing FLV player:', error);
            }
        } else {
            console.error('FLV.js is not supported.');
        }
    };
</script>
</body>
</html>